<template>
  <el-container style="height: 100%; border: 1px solid #eee">
    <el-header style=" font-size: 12px;background-color: gray">

      <div style="float: right;display: inline">
        <span style="font-size: 16px;">欢迎！{{ schoolname }}</span>
        <el-button style="background-color: gray;color: black;border: gray;font-size: 16px" @click="exit()" class="el-icon-circle-close">退出登录</el-button>
      </div>
      <div style="display: inline">
        <span style="font-size: 20px;color: white" class="el-icon-s-home">中小学教学质量信息采集及评估系统</span>
      </div>
    </el-header>


    <el-container>
      <el-aside style="width: 250px; height: 100%; background-color: rgb(19,36,58);">
        <el-menu router text-color="white" style="background-color:  rgb(19,36,58) "
                 :background-color="variables.menuBg"
                 :active-text-color="variables.menuActiveText"
                 :text-color="variables.menuText">
          <el-submenu index="1">
            <template slot="title" ><i class="el-icon-s-order" style="color: white"></i>
              学校评审</template>
            <router-link :to="{path:'SchoolUserArrange',
          query:{
            schoolname:schoolname
          }}" active-class="active"><el-menu-item><i class="el-icon-search"></i>查看评价任务</el-menu-item></router-link>


          </el-submenu>
          <el-submenu index="2">
            <template slot="title"><i class="el-icon-edit-outline" style="color: white"></i>
              开始评估</template>
            <div v-if="successTotal().total===successTotal().finished" style="color: white">全部完成</div>
<!--            <span>完成统计:{{successTotal().finished}}/{{successTotal().total}}</span>-->
            <el-tree
                style="background-color: #304156;color:white;"
                :data="tableData"
                :props="defaultProps"
                ref="menuTree"
                node-key="label"
                active-class="active"
                accordion
                @node-click="handleNodeClick">
              <template class="custom-tree-node" v-slot="{ node, data }">
            <span>
              <span v-if="node.data.evaluateid">({{index1SuccessNum(node)}}/{{node.data.children.length}}) </span>
              <span v-if="node.data.evaluateindex1id&&node.data.evaluateindex2id">({{index2SuccessNum(node)}}/{{node.data.children.length}}) </span>
<!--              <i class="el-icon-success"></i>-->

              <i class="el-icon-star-on" v-show="node.data.evaluateindex3id&&node.data.success"></i>
              <i class="el-icon-star-off" v-show="node.data.evaluateindex3id&&!node.data.success"></i>
              {{ node.label}}
            </span>
        </template>
            </el-tree>
          </el-submenu>

<!--          <el-submenu index="3">-->
<!--            <template slot="title"><i class="el-icon-loading" style="color: white"></i>-->
<!--              Test</template>-->
<!--            <router-link :to="{path:'/Upload',-->
<!--          query:{-->
<!--            schoolname:schoolname-->
<!--          }}" active-class="active"><el-menu-item>文件上传测试</el-menu-item></router-link>-->
<!--          </el-submenu>-->
          <el-submenu index="4">
            <template slot="title"><i class="el-icon-setting"></i>
              账户管理</template>
            <router-link to="/SchoolUserChangePass"><el-menu-item><i class="el-icon-lock" ></i>修改密码</el-menu-item></router-link>
          </el-submenu>
        </el-menu>
      </el-aside>

      <el-main>
        <transition name="fade-transform" mode="out-in">
          <router-view @father="update" :key="$route.fullPath"></router-view>
        </transition>
      </el-main>
    </el-container>
  </el-container>
</template>

<script>
import variables from '@/assets/variables.scss'
export default {
  name: "indexSchoolUser",
  data(){
    return{
      success:'',
      schooluser:'',
      schoolname:'',
      tableData:null,
      evaluatetaskid:'',
      defaultProps: {
        children: 'children',
        label: 'label'
      }
    }
  },
  computed:{
    successTotal(){
      return function (){
        let total = 0
        let finished =0
        // console.log(this.tableData)
        for (let i of this.tableData)
        {
          for (let j of i.children){
            for (let k of j.children){
              total++
              if (k.success){
                finished++
              }
            }
          }
        }
        // console.log('1111',this.$store.state.schoolname)
        // 如果此学校已完成评估:更新数据库 先判断是否完成字段是否为否 为否 则判断total===finished 进行更新
        if  (total===finished) {
          axios.get('http://localhost:8081/getRightTaskId/' + this.$store.state.schoolname).then((res) => {
            console.log(res.data);
            let evaluatetaskid = res.data
            axios.get("http://localhost:8081/evaluatetaskarrange/selectone/schooluser2/" + this.$store.state.schoolname + '/' + evaluatetaskid).then((res) => {
              console.log(res.data)
              if (res.data.isfinished === '否') {
                console.log('任务未完成')
                res.data.isfinished='是'
                axios.put("http://localhost:8081/evaluatetaskarrange/update/",res.data).then((res)=>{
                  console.log(res.data.msg)
                })
              } else {

              }
            })
          })
        }
        else {
          axios.get('http://localhost:8081/getRightTaskId/' + this.$store.state.schoolname).then((res) => {
            console.log(res.data);
            let evaluatetaskid = res.data
            axios.get("http://localhost:8081/evaluatetaskarrange/selectone/schooluser2/" + this.$store.state.schoolname + '/' + evaluatetaskid).then((res) => {
              console.log(res.data)
              if (res.data.isfinished === '是') {
                res.data.isfinished='否'
                axios.put("http://localhost:8081/evaluatetaskarrange/update/",res.data).then((res)=>{
                  console.log(res.data.msg)
                })
              } else {

              }
            })
          })
        }
        return {total:total, finished:finished}
      }
    },
    index1SuccessNum(){
      return function (no){
        // console.log('计算属性参数',no)
        let cnt=0
        for (let i of no.data.children){
          let flag=1;
          for (let j of i.children){
            if (!j.success){
              flag=0
              break;
            }
          }
          if(flag) {
            cnt+=1
          }
        }
        return cnt;
      }
    },
    // 统计二级指标完成数
    index2SuccessNum(){
      return function (no){
        let cnt=0;
        for (let i of no.data.children){
          if(i.success){
            cnt++
          }
        }
        return cnt
      }
    },
    variables() {
      return variables
    },
},
  methods:{
    // 设置完成标记
    update(label){
      const node = this.$refs.menuTree.getNode(label)
      node.data.success = true
      node.data = JSON.parse(JSON.stringify(node.data))
      // console.log('父组件中的方法-----')
      // 更新学校用户完成情况（info字段）
      let data = {
        id: this.$store.state.schoolId,
        info: JSON.stringify(this.tableData)
      }
      axios.post('http://localhost:8081/schooltask/respost',data).then((res)=>{
        // console.log(res)
      })
    },
    handleNodeClick(data, node){
      const a = this.$refs.menuTree.getNode(data.label)
      // 找到叶子节点
      if (a.isLeaf){
        // alert('开始评估')
        this.$router.push({path:"/StartEvaluate", query:{item: JSON.stringify(a.data),
          schoolname:this.schoolname, }})
      }
    },
    exit(){
      // localStorage.removeItem("access-schooluser")

      const d=confirm("确定退出吗？");
      if(d){
        this.$router.push("/login")
      }
    }
  },
  created() {
    // console.log('this is creat!')
    const su=localStorage.getItem("access-schooluser")
    if (su){
      this.schooluser=JSON.parse(window.localStorage.getItem('access-schooluser'))
      // this.schooluser=window.localStorage.getItem('access-schooluser')
      console.log('asdsadasd',this.schooluser)
      axios.get('http://localhost:8081/schooluser/selectone/2/'+this.schooluser.username).then((res)=>{
        this.$store.commit('setSchoolId',res.data.id)
        this.$store.commit('setSchoolname',res.data.schoolname)
        console.log(res.data)
        console.log(this.$store.state.schoolname)
        this.schoolname=this.$store.state.schoolname
        // 判断info字段是否为空
        if(res.data.info)
        {
          this.tableData = JSON.parse(res.data.info)
        }else{
          // info为空 学校没有过提交记录
          axios.get('http://localhost:8081/evaluatetree/'+this.schoolname).then( (res)=>{
            this.$store.commit('setTreeTable',res.data)
            this.tableData= this.$store.state.treeTable
            // console.log(this.tableData)
          })
        }
      })
    }
    else{
      this.$alert('未登录','提示',{
        confirmButtonText:'确定'
      }).then((res)=>{
        this.$router.replace({path:'/login'})
      })
    }

  },
  beforeDestroy() {
    // 提交完成情况
    // let data = {
    //   schoolname: this.schoolname,
    //   desc: this.tableData
    // }
    // axios.post('http://localhost:8081/school/respost',data).then((res)=>{
    //   console.log(res)
    // })
  },
  watch:{
    tableData: {
      handler(newVal, oldVal) {
        // console.log('深度监听', newVal,'----', oldVal)
      },
      deep: true
    },

  }
}
</script>

<style scoped>
a {
  text-decoration: none;
}
.el-menu-item{
  background-color: rgb(58, 87, 126);
}
.router-link-active {
  text-decoration: none;
}

</style>
